<template>
  <view class="pageLayout">
    <z-swiper v-model="list" :options="{ slidesPerView: 3, spaceBetween: 20 }">
      <z-swiper-item v-for="(item, index) in list" :key="index">
        <image class="image" :src="item" mode="aspectFill"></image>
      </z-swiper-item>
    </z-swiper>
  </view>
</template>

<script>
import store from "../../store/index";
import CategoryLinkage from "@/components/CategoryLinkage.vue";
export default {
  components: {
    CategoryLinkage,
  },
  data() {
    return {
      list: [
        "https://cdn.zebraui.com/zebra-ui/images/swipe-demo/swipe1.jpg",
        "https://cdn.zebraui.com/zebra-ui/images/swipe-demo/swipe2.jpg",
        "https://cdn.zebraui.com/zebra-ui/images/swipe-demo/swipe3.jpg",
        "https://cdn.zebraui.com/zebra-ui/images/swipe-demo/swipe4.jpg",
        "https://cdn.zebraui.com/zebra-ui/images/swipe-demo/swipe5.jpg",
      ],
    };
  },
  computed: {
    hasLogin() {
      return this.$store.state.token && this.$store.state.token.length > 0;
    },
  },
  methods: {},
  onShow() {},
  /**
   * 上拉加载更多
   */
  onReachBottom() {},
};
</script>

<style lang="scss" scoped>
.pageLayout {
  padding: 24rpx;
  height: 100vh;
}

.image {
  width: 100%;
}
</style>
